<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE composition PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<ui:composition xmlns:ui="http://java.sun.com/jsf/facelets"
                template="./../template/WorkspaceTemplate.xhtml"
                xmlns:c="http://java.sun.com/jsp/jstl/core"
                xmlns:h="http://java.sun.com/jsf/html"
                xmlns:p="http://primefaces.prime.com.tr/ui"
                xmlns:f="http://java.sun.com/jsf/core">

    <ui:define name="top">

    </ui:define>

    <ui:define name="left">
    </ui:define>

    <ui:define name="content">
        <style>
            .ars td {
                display: block;
            }
        </style>
        <h:form>
            <p:panel id="panel" header="Create New Security Role">
                <p:messages />
                <h:panelGrid columns="3" cellpadding="10">
                    <h:outputLabel for="roleName" style="font-weight: bold" value="Role Name: "/>
                    <h:inputText required="true" label="Role Name" requiredMessage="Role name is required."
                                 id="roleName" value="#{userRoleManagerBean.roleName}">
                        <f:validateLength minimum="4" maximum="16" />
                    </h:inputText>
                    <p:message for="roleName"/>

                    <h:outputLabel for="department" style="font-weight: bold" value="Department: "/>
                    <p:autoComplete id="department"  forceSelection="true" required="true" requiredMessage="Department is required."
                                    value="#{userRoleManagerBean.department}"  
                                    completeMethod="#{accountManagerBean.completeDepartments}"/>
                    <p:message for="department"/>

                </h:panelGrid>

                <p:panel header="Assign access rights to this role: ">
                    <h:selectManyCheckbox styleClass="ars" id="accessRights" value="#{userRoleManagerBean.selectedRights}">
                        <f:selectItems value="#{userRoleManagerBean.allAccessRights}" var="item" itemLabel="#{item.methodName}"
                                       itemValue="#{item.id}"/>
                    </h:selectManyCheckbox>
                </p:panel>

                <p:commandButton id="button" value="Create New Security Role" 
                                 update="panel" actionListener="#{userRoleManagerBean.addNewSecurityRole}" ajax="true"/>
            </p:panel>
            <p:ajaxStatus style="width: 16px;height: 16px;">
                <f:facet name="start">
                    <h:graphicImage value="./../images/ajaxloading.gif"/>
                </f:facet>
                <f:facet name="complete">
                    <h:outputText value=""/>
                </f:facet>
            </p:ajaxStatus>
        </h:form>
    </ui:define>

    <ui:define name="bottom">

    </ui:define>

</ui:composition>
